<template >
    <div>
        <ul>
            <li v-bind:key="item"   v-for="(item,index) in list" @click="listclick(index)">{{item}}</li>
            
        </ul> <br>
   
        <p>自定义事件:</p>
        
        <input   v-model="inputValue" ><button @click="btn" >确认</button>
    </div>
</template>
<script>
    export default {
         name:"homenews",
         data(){
        return{list:["学vue","吃早饭","睡午觉"],
                inputValue:" 输入你要做的事"
        }
        },
        methods:{
            listclick(index){
                console.log(this.list[index])
                var message = this.list[index]
                this.$router.push({
                   path:'/home/message' ,
                   query:{
                       message
                   }
                   })
            },
            btn(){
                console.log(this.inputValue)
                var message = this.inputValue
                this.$router.push({
                   path:'/home/message' ,
                   query:{
                        message
                   }
                })
            }
        }
}
</script>
<style scoped>
    li{
        list-style-type:none;
      }
     
</style>